/**
 * Created by 高子峰 on 2017/8/3.
 */
'use strict';

require('./index.css');
require('page/common/nav-simple/index.js');
var _user = require('service/user-service.js');
var _mm = require('util/mm.js');

//表单里的错误提示
var formError = {
    show : function(errMsg){
        $('.error-item').show().find('.err-msg').text(errMsg);
    },
    hide : function(){
        $('.error-item').hide().find('.err-msg').text('');
    }
};

//page 逻辑部分
var page={
    //把用户名和返回的密码提示问题存起来，这样方便后边用的时候，直接拿来使用
    data : {
        username : '',
        question : '',
        answer   : '',
        token    : ''
    },
    init: function(){
        this.onLoad();
        this.bindEvent();
    },
    onLoad : function(){
        this.loadStepUsername();
    },
    bindEvent : function(){
        var _this=this;
        //输入用户名--下一步按钮的点击
        $('#submit-username').click(function(){
            //_this.submit();   不写这个，因为没有其他复用这个submit
            //直接把submit的功能写在这里即可,与login/index.js做对比
            var username = $.trim($('#username').val());
            //用户名存在
            if(username){
                _user.getQuestion(username,function(res){
                    _this.data.username = username;
                    _this.data.question = res;
                    _this.loadStepQuestion();//调用第二步，显示密码提示问题框
                },function(errMsg){
                    formError.show(errMsg);
                });
            }
            //用户名不存在
            else{
                formError.show('请输入用户名');
            }
        });

        //输入密码提示问题答案--下一步按钮的点击
        $('#submit-question').click(function(){
            var answer = $.trim($('#answer').val());
            //密码提示问题答案存在
            if(answer){
                //检查密码提示问题答案
                _user.checkAnswer({
                    username : _this.data.username,
                    question : _this.data.question,
                    answer   : answer
                },function(res){
                    _this.data.answer = answer;
                    _this.data.token = res; //注意这里是放res而不是token
                    _this.loadStepPassword();//调用第二步，显示密码提示问题框
                },function(errMsg){
                    formError.show(errMsg);
                });
            }
            //用户名不存在
            else{
                formError.show('请输入密码提示问题的答案');
            }
        });

        //输入新密码后--下一步按钮的点击
        $('#submit-password').click(function(){
            var password = $.trim($('#password').val());
            //密码不为空
            if(password && password.length >= 6){
                //检查密码提示问题答案
                _user.resetPassword({
                    username      : _this.data.username,
                    passwordNew   : password,
                    forgetToken   : _this.data.token
                },function(res){
                    window.location.href = './result.html?type=pass-reset';
                },function(errMsg){
                    formError.show(errMsg);
                });
            }
            //密码为空
            else{
                formError.show('请输入不少于6位的新密码');
            }
        });

    },
    //加载输入用户名的一步
    loadStepUsername : function(){
        $('.step-username').show();
    },
    //加载输入密码提示问题答案的一步
    loadStepQuestion : function(){
        //清除错误提示
        formError.hide();//如果之前有错误信息，则隐藏掉
        //做容器的切换
        $('.step-username').hide()
            .siblings('.step-question').show()
            .find('.question').text(this.data.question);   //获得匹配集合中每个元素的同胞，通过选择器进行筛选是可选的
    },
    //加载输入password的一步
    loadStepPassword : function(){
        //清除错误提示
        formError.hide();
        //做容器的切换
        $('.step-question').hide()
            .siblings('.step-password').show();  //获得匹配集合中每个元素的同胞，通过选择器进行筛选是可选的
    },
};
$(function(){       //$(function(){}) 是 $(document).ready(function(){}) 的简写，用来在DOM加载完成之后执行一系列预先定义好的函数。
    page.init();
});